<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<title>javascript 显示器分辨率</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<style type="text/css">
	body
	{
		margin:0;
		padding:0;
	}
	</style>
</head>
<body>
<div style="width:3000px;height:2000px;">
<h1>javascript 显示器分辨率</h1>
<div style="position:fixed;left:20px;top:50px;background:#FFCC00;" id="content">

</div>
</div>
<script type="text/javascript">
//<![CDATA[
//var font_size = screen.width / 64 + 'px';
//document.body.style.fontSize = font_size;
//var p = document.createElement("p");
//p.innerHTML = "分辨率" + screen.width + 'x' + screen.height;
//alert("分辨率" + screen.width + 'x' + screen.height);
function showWidth()
{
	var     s   =   " ";
	s   +=   "<p>网页可见区域宽： "+   document.body.clientWidth;
	s   +=   "</p><p>网页可见区域高： "+   document.body.clientHeight;
	s   +=   "</p><p>网页可见区域宽： "+   document.body.offsetWidth     + "   (包括边线和滚动条的宽) ";
	s   +=   "</p><p>网页可见区域高： "+   document.body.offsetHeight   + "   (包括边线的宽) ";
	s   +=   "</p><p>网页正文全文宽： "+   document.body.scrollWidth;
	s   +=   "</p><p>网页正文全文高： "+   document.body.scrollHeight;
	s   +=   "</p><p>网页被卷去的高： "+   document.body.scrollTop;
	s   +=   "</p><p>网页被卷去的左： "+   document.body.scrollLeft;
	s   +=   "</p><p>网页正文部分上： "+   window.screenTop;
	s   +=   "</p><p>网页正文部分左： "+   window.screenLeft;
	s   +=   "</p><p>屏幕分辨率的高： "+   window.screen.height;
	s   +=   "</p><p>屏幕分辨率的宽： "+   window.screen.width;
	s   +=   "</p><p>屏幕可用工作区高度： "+   window.screen.availHeight;
	s   +=   "</p><p>屏幕可用工作区宽度： "+   window.screen.availWidth;
	s   +=   "</p><p>你的屏幕设置是   "+   window.screen.colorDepth   + "   位彩色 ";
	s   +=   "</p><p>你的屏幕设置   "+   window.screen.deviceXDPI   + "   像素/英寸 </p>"; 
	document.getElementById('content').innerHTML = s;
}
window.onload = function()
{
	showWidth();
}
window.onresize = function()
{
	showWidth();
}
window.onscroll = function()
{
	showWidth();
}
//]]>
</script>
</body>
</html>